<template>
	<view class="content" v-if="pageShow">
		<!-- 頭部 -->
		<view class="btnBox ffffff flexbetween">
			<view class="flexleft" style="width: 82%;">
				<view class="margin_right1" @click="goBack">
					<u-icon name="home" color="#333" size="24"></u-icon>
				</view>
				<view class="searchBox" style="width: 100%;">
					<input class="margin_left1" type="text text_b" placeholder="請輸入商品名稱"
						placeholder-style="font-size: 24rpx;font-weight: 500;color: #B5B5B5;" v-model="name"
						confirm-type="search" @confirm="getGoodsList">
				</view>
			</view>
			<view class="flexleft">
				<view @click="collectshop()">
					<u-icon class="margin_right2" v-if="shopInfo.is_user_collect==0" name="star" color="#333"
						size="24"></u-icon>
					<u-icon class="margin_right2" v-else name="star-fill" color="#ffa126" size="24"></u-icon>
				</view>
				<view @click="sharemsg">
					<u-icon name="share" color="#333" size="24"></u-icon>
				</view>
			</view>
		</view>
		<u-swiper :list="shopInfo.topimages_arr" radius="0" height="250" circular></u-swiper>
		<!-- 店鋪 -->
		<view class="shopBox">
			<view class="flexbetween">
				<view class="shopName">{{shopInfo.name}}</view>
				<image class="shopImg" :src="shopInfo.logoimage" mode=""></image>
			</view>
			<view class="flexbetween margin_top">
				<view class="flexleft">
					<view class="call margin_right3" @click="goPhoneService" v-if="shopInfo.is_call==1">呼叫商家
					</view>
					<view class="reservation" @click="goReservation" v-if="shopInfo.is_pre==1">線上預約排隊</view>
				</view>
				<view class="scan" v-if="shopInfo.is_scan==1" @click="scancode">掃描加購</view>
			</view>
			<!-- tab栏 -->

		</view>
		<u-sticky bgColor="#fafafa" customNavHeight="0">
			<view class="mainpadding2">
				<view class="flexbetween ffffff" style="margin-left: -20rpx;">
					<u-tabs :list="tabList" @click="change" lineWidth="50rpx" lineColor="#FFB800"
						:activeStyle="{color: '#000000',fontWeight: 800,transform: 'scale(1.05)'}"
						:inactiveStyle="{color: '#666666',transform: 'scale(1)'}"></u-tabs>
					<view class="chat2" @click="jumpdetail('/pages_index/dianpucz?id=',shop_id)" v-if="shopInfo.is_has_rechargeitem==1">儲值</view>
					<view class="chat dingwei" @click="lingquan">
						領券
						<view class="xiaodd">
							<u-badge max="99"
								:value="Number(shopInfo.user_shipNum)+Number(shopInfo.user_shipNum)"></u-badge>
						</view>
					</view>
				</view>
				<!-- 篩選 -->
				<view class="margin_top flexbetween">
					<view class="flexleft">
						<view :class="current==3?'color_ling text_a':'color_six text_a'" @click="screenGoods()">分類篩選
						</view>
						<view class="screen" style="margin-left: 5rpx;"></view>
					</view>
					<view :class="current==0?'color_ling text_a':'color_six text_a'" @click="selectCom()">
						綜合排序
					</view>
					<view class="flexleft">
						<view :class="current==1?'color_ling text_a':'color_six text_a'" @click="selectSale()">銷量排序
						</view>
						<view>
							<view :class="type==2?'arrow_top_active':'arrow_top'"></view>
							<view :class="type==1?'arrow_bottom_active':'arrow_bottom'"></view>
						</view>
					</view>
					<view class="flexleft">
						<view :class="current==2?'color_ling text_a':'color_six text_a'" @click="selectPrice()">價格排序
						</view>
						<view>
							<view :class="type==4?'arrow_top_active':'arrow_top'"></view>
							<view :class="type==3?'arrow_bottom_active':'arrow_bottom'"></view>
						</view>
					</view>
				</view>
				<!-- 分類篩選 -->
				<view class="margin_top">
					<scroll-view class="white_nowrap" scroll-x>
						<view class="flexleft">
							<view class="margin_right2" v-for="(item,index) in shop_class">
								<view :class="item.isChecked?'cateSelect':'cateNoSelect'" @click="selectCate(item)">
									{{item.name}}
								</view>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
		</u-sticky>


		<!-- 商品 -->
		<view class="paddinglr" v-show="tabActive==0">
			<view class="flexcenter" v-if="!list.data.length">
				<view class="placeholderimage" style="margin-top: 100rpx;"></view>
			</view>
			<!-- 商品列表 -->
			<view class="flexbetween flex_wrap">
				<view class="goodsBox margin_top ffffff padding_bottom word_wrap" v-for="item in list.data"
					:key="item.id" @click="goGoodsInfo(item.id)">
					<view class="goodsImg">
						<image class="" :src="item.logoimage" mode="" v-if="item.logoimage"></image>
						<image class="goodsImg" src="../static/images/index/noImg.jpg" mode="" v-else>
					</view>
					<view class="text_j color_san margin_top paddinglr15">{{item.name}}</view>
					<view class="xiaohui margin_top2 paddinglr15 yihang">{{item.des}}</view>
					<view class="flexbetween margin_top paddinglr15">
						<view class="text_pee color_six">月售{{item.count}}</view>
						<view class="text_pee color_six" v-if="item.end_num!=-1">庫存{{item.end_num}}</view>
						<view class="text_pee color_six" v-if="item.end_num==-1">不限庫存</view>
					</view>
					<view class="flexbetween margin_top paddinglr15">
						<view class="price">$ <text style="font-size: 30rpx;">{{item.new_price}}</text> </view>
						<image style="width: 34rpx;height: 34rpx;" src="/static/images/index/add_red.png" mode="">
						</image>
					</view>
				</view>
			</view>
		</view>
		<!-- 票券 -->
		<view class="paddinglr" v-show="tabActive==3">
			<!-- 篩選 -->
			<view class="margin_top flexbetween">
				<!-- <view class="flexleft">
					<view :class="current==3?'color_ling text_a':'color_six text_a'" @click="screen()">分類篩選</view>
					<view class="screen" style="margin-left: 5rpx;"></view>
				</view> -->
				<view :class="current==0?'color_ling text_a':'color_six text_a'" @click="selectabzh()">
					綜合排序
				</view>
				<view class="flexleft">
					<view :class="current==1?'color_ling text_a':'color_six text_a'" @click="selectab()">銷量排序</view>
					<view>
						<view :class="type==1?'arrow_top_active':'arrow_top'"></view>
						<view :class="type==2?'arrow_bottom_active':'arrow_bottom'"></view>
					</view>
				</view>
				<view class="flexleft">
					<view :class="current==2?'color_ling text_a':'color_six text_a'" @click="selectabprice()">價格排序
					</view>
					<view>
						<view :class="type==3?'arrow_top_active':'arrow_top'"></view>
						<view :class="type==4?'arrow_bottom_active':'arrow_bottom'"></view>
					</view>
				</view>
			</view>
			<!-- 分類篩選 -->
			<view class="margin_top">
				<!-- <scroll-view class="white_nowrap" scroll-x>
					<view class="flexleft">
						<view class="margin_right2" v-for="(item,index) in 8">
							<view :class="index==0?'cateSelect':'cateNoSelect'">產品一</view>
						</view>
					</view>
				</scroll-view> -->
				<view class="flexcenter">
					<view :class="ticketsType==0?'cateSelect margin_right2':'cateNoSelect margin_right2'"
						@click="ticketsType=0">電影票</view>
					<view :class="ticketsType==1?'cateSelect margin_right2':'cateNoSelect margin_right2'"
						@click="ticketsType=1">演唱會</view>
					<view :class="ticketsType==2?'cateSelect':'cateNoSelect'" @click="ticketsType=2">店家券</view>
				</view>
			</view>
			<!-- 電影列表 -->
			<view>
				<view class="margin_top ffffff mainpadding flex border2" v-for="item in 4"
					@click="goTicketsType(ticketsType)">
					<view class="ticketImg margin_right2">
						<image class="" src="/static/goods.png" mode="aspectFill"></image>
					</view>
					<view class="justify_between_column" style="height: 228rpx;">
						<view class="text_weight color_ling" style="font-size: 34rpx;">八角笼中</view>
						<view class="text_five color_jiu" v-show="ticketsType==0">
							電影評分
							<text class="margin_left1" style="color: rgba(255, 0, 0, 1);">9.4</text>
						</view>
						<view class="text_five color_jiu" v-show="ticketsType==0">導演：王宝强</view>
						<view class="text_five color_jiu" v-show="ticketsType==0">類型：剧情</view>
						<view class="text_five color_jiu" v-show="ticketsType==0">主演：王宝强,王迅</view>

						<view class="text_five color_jiu" v-show="ticketsType==1||ticketsType==2">郑州奥体中心</view>
						<view class="ticketPrice" v-show="ticketsType==1||ticketsType==2">$89起</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 評價 -->
		<view v-show="tabActive==1">
			<view class="margin_top mainpadding ffffff" v-for="item in lists.data" :key="item.id">
				<!-- <view class="flexleft">
					
					<image class="evalHead margin_right2" src="../static/goods.png" mode=""></image>
					<view class="flex1">
						<view class="flexbetween margin_bottom1">
							<view class="color_ling text_d">岁岁有年年</view>
							<view class="color_six text_five">2023.04.31</view>
						</view>
						<u-rate :count="count" v-model="value" active-color="#FAB536" size="14" readonly></u-rate>
					</view>
				</view> -->
				<view class="flexbetween">
					<view class="flexleft" v-if="item.is_n==0 && item.user_data">
						<image :src="item.user_data.avatar" class="evalHead" mode=""></image>
						<view class="hei_text margin_left bold main_size">{{item.user_data.nickname}}</view>
					</view>
					<view class="huang_text bold main_size" v-else>匿名用戶</view>
					<view class="xiaohui">{{http.returnDate(item.createtime*1000)}}</view>
				</view>
				<view class="margin_top">
					<u-rate :count="5" v-model="item.shop_pf" active-color="#FAB536" size="14" readonly></u-rate>
				</view>
				<view class="color_six text_a margin_top">{{item.shop_txt}}</view>
				<view class="flexleft flex_wrap">
					<view class="evalImg margin_top" v-if="item.images_text.length"
						v-for="(ite,ind) in item.images_text" @click="lbtpriview(ind,item.images_text)" :key="ind">
						<image class="listleftimg radius" :src="ite" mode=""></image>
					</view>
				</view>
			</view>
		</view>
		<!-- 商家 -->
		<view class="margin_top mainpadding ffffff" v-show="tabActive==2">
			<view class="flexleft">
				<image class="shopInfoImg" src="/static/images/index/address.png" mode=""></image>
				<view class="color_san text_five">{{shopInfo.address}}</view>
			</view>
			<view class="flexleft flex_wrap padding_bottom border_bottom">
				<view class="evalImg margin_top" v-for="(item,index) in shopInfo.inimages_arr" :key="index"
					@click="lbtpriview(index,shopInfo.inimages_arr)">
					<image :src="item" mode=""></image>
				</view>
			</view>
			<view class="flexbetween margin_top padding_bottom border_bottom">
				<view class="flex">
					<image class="shopInfoImg" src="/static/images/index/phone.png" mode=""></image>
					<view class="color_san text_five">{{shopInfo.shopmbl}}</view>
				</view>
				<view class="flexleft">
					<view class="margin_right4 text" @click.stop="daohang(shopInfo.address)">
						<image class="shopPhone" src="/static/images/index/navigation.png" mode=""></image>
						<view class="text_pee color_san">導航</view>
					</view>
					<view class="margin_right4 text" @click.stop="phone(shopInfo.shopmbl)">
						<image class="shopPhone" src="/static/images/index/phoneShop.png" mode=""></image>
						<view class="text_pee color_san">電話</view>
					</view>
				</view>
			</view>
			<view class="flexleft margin_top">
				<image class="shopInfoImg" src="/static/images/index/time.png" mode=""></image>
				<view class="color_san text_five">營業時間</view>
			</view>
			<view class="flexleft flex-wrap color_san margin_top text_five" v-if="shopInfo.motime">
				<view class="">周一：</view>
				<view class="margin_right1" v-for="item in shopInfo.motime.split(',')" :key="item">{{item}}</view>
			</view>
			<view class="flexleft flex-wrap color_san margin_top text_five" v-if="shopInfo.tutime">
				<view class="">周二：</view>
				<view class="margin_right1" v-for="item in shopInfo.tutime.split(',')" :key="item">{{item}}</view>
			</view>
			<view class="flexleft flex-wrap color_san margin_top text_five" v-if="shopInfo.wetime">
				<view class="">周三：</view>
				<view class="margin_right1" v-for="item in shopInfo.wetime.split(',')" :key="item">{{item}}</view>
			</view>
			<view class="flexleft flex-wrap color_san margin_top text_five" v-if="shopInfo.thtime">
				<view class="">周四：</view>
				<view class="margin_right1" v-for="item in shopInfo.thtime.split(',')" :key="item">{{item}}</view>
			</view>
			<view class="flexleft flex-wrap color_san margin_top text_five" v-if="shopInfo.frtime">
				<view class="">周五：</view>
				<view class="margin_right1" v-for="item in shopInfo.frtime.split(',')" :key="item">{{item}}</view>
			</view>
			<view class="flexleft flex-wrap color_san margin_top text_five" v-if="shopInfo.satime">
				<view class="">周六：</view>
				<view class="margin_right1" v-for="item in shopInfo.satime.split(',')" :key="item">{{item}}</view>
			</view>
			<view class="flexleft flex-wrap color_san margin_top text_five" v-if="shopInfo.sutime">
				<view class="">周日：</view>
				<view class="margin_right1" v-for="item in shopInfo.sutime.split(',')" :key="item">{{item}}</view>
			</view>
		</view>
		<!-- 底部 -->
		<view class="footerBox" v-show="tabActive==0">
			<view class="footerPirce flexbetween">
				<view class="flexbetween" style="width: 100%;">
					<view class="flexleft paddingtb padding_left3">
						<view class="cart margin_right3" @click="goCart">
							<view class="num" v-text="total"></view>
						</view>
						<view class="line_r margin_right2"></view>
						<view>
							<text class="color_ling text_d">合計：</text>
							<text class="totalPrice">$</text>
							<text class="totalPrice" style="font-size: 36rpx;" v-text="total_price"></text>
						</view>
					</view>
					<view class="settlementleft" @click="connection">聊聊</view>
				</view>

				<view class="settlement" @click="goCart">結帳</view>
			</view>
		</view>
		<!-- <image class="kefuImg" src="/static/images/index/kefu.png" mode="" @click="connection"></image> -->
		<template v-if="hongbao">
			<liu-drag-button @clickBtn="shareShop(shopInfo)">
				<view class="flexcolumn dingwei">
					<image src="@/static/images/index/hongbao.png" style="width: 140rpx;height: 140rpx;" mode="">
					</image>
					<image src="/static/images/index/deletetwo.png" @click.stop="hongbao=false"
						style="width: 50rpx;height: 50rpx;position: absolute;top: 0;right: -10rpx;" mode=""></image>
					<view
						style="color:#fff;padding: 5rpx 10rpx;background-color: #333;border-radius: 20rpx;font-size: 26rpx;">
						分享領現金</view>
				</view>
			</liu-drag-button>
		</template>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				hongbao: true,
				current: 0,
				type: 0, //排序類型默認0，1=銷量降，2-=銷量升，3=價格降 4=價格升
				tabActive: 0,
				tabList: [{
					name: "商品"
				}, {
					name: "評價"
				}, {
					name: "商家總覽"
				}, {
					name: "票券"
				}],
				count: 5,
				value: 5,
				ticketsType: 0, //票券類型 0電影票 1演唱會 2店家券
				shop_id: "", //店鋪id
				shopInfo: {}, //店鋪詳情
				shopclassify_id: "", //分類id
				list: {
					data: []
				}, //商品列表
				pageShow: false,
				name: "", //關键词
				total_price: 0, //購物車總金額
				total: 0, //購物車總數量
				page: 1,
				limit: 12,
				lists: {
					data: []
				},
				pagedown: true,
				shop_class: [],
				issm: 0, //是否扫店家码/桌台码进来的
			}
		},
		onLoad(options) {
			this.shop_id = options.id
			uni.setStorageSync('shop_id', options.id)
			if (options.invite_code) {
				uni.setStorageSync("other_invite_code", options.invite_code)
			}
			if (options.zth) {
				uni.setStorageSync("zth", options.zth)
				uni.setStorageSync("ztnum", decodeURIComponent(options.ztnum))
			}
			if (options.issm) {
				this.issm = 1
				this.setdd() //用户扫码点餐如果存在预约订單且未到达需要直接到达
			}
			this.init()
			this.getGoodsList()
			this.getShopclass()
		},
		async onShow() {
			uni.$off("screenId")
			uni.$on("screenId", data => {
				console.log(data, "選擇的分類id");
				this.shopclassify_id = data
				this.getGoodsList()
			})
			if (httpRequest.checkIsLogin()) {
				let res = await this.getCartList(this.shop_id)
				if (res) {
					this.total_price = res.total_price
					this.total = res.total
				} else {
					this.total_price = 0
					this.total = 0
				}
			} else {
				this.total_price = 0
				this.total = 0
			}
			this.getInfo()
		},
		methods: {
			shareShop(item) {
				let that = this
				if (navigator.share) {
					navigator.share({
							title: item.fy_share_title,
							text: item.fy_share_title,
							url: window.location.href + '&invite_code=' + uni.getStorageSync(
								"invite_code"), // 當前頁面 URL
						})
						.then(() => {
							console.log('分享成功');
						})
						.catch(error => {
							console.error('分享失敗', error);
						});
				} else {
					this.http.toast("當前瀏覽器不支持分享")
				}
			},
			setdd() {
				if (!httpRequest.checkIsLogin()) {
					return false
				}
				httpRequest.request('/api/Ordermake/authtoOrdermake', 'GET', {
					shop_id: this.shop_id
				}).then(res => {})
				httpRequest.request('/api/hotel/autoHotelOrder', 'GET', {
					shop_id: this.shop_id
				}).then(res => {})
			},
			getShopclass() {
				httpRequest.request('/api/shop/shopCategory', 'GET', {
					shop_id: this.shop_id
				}).then(res => {
					if (res.data.length) {
						res.data.forEach(item => {
							this.$set(item, "isChecked", false)
						})
						res.data.unshift({
							id: "",
							name: "全部",
							isChecked: true
						})
					} else {
						res.data = [{
							id: "",
							name: "全部",
							isChecked: true
						}]
					}
					this.shop_class = res.data
				})
			},
			connection() {
				if (this.shopInfo.user_id == uni.getStorageSync('user_id')) {
					httpRequest.toast("自己不能和自己聊天哦！");
					return false
				}
				let that = this
				uni.showLoading({
					mask: true,
					title: "請稍後"
				})
				httpRequest.request('/api/user/addFriends', 'GET', {
					firend_id: this.shopInfo.user_id,
					sendtype: 1,
					user_id: uni.getStorageSync('user_id')
				}).then(res => {
					uni.hideLoading()
					let data = {
						firend_id: this.shopInfo.user_id,
						friend_name: this.shopInfo.name,
						firend_avatar_text: this.shopInfo.logoimage_text
					}
					uni.navigateTo({
						url: "/pages_message/chat?msg=" + encodeURIComponent(JSON.stringify(data))
					})
				})
			},
			lbtpriview(index, arr) {
				var i = arr; //獲取当前頁面的轮播圖數据
				//uniapp预览轮播圖
				uni.previewImage({
					current: index, //预览圖片的下标
					urls: i //预览圖片的地址，必须要數组形式，如果不是數组形式就转換成數组形式就可以
				})
			},
			init(isPage, page) {
				let _this = this
				let url = "/api/shop/evaluatelist"
				let data = {
					page: page || 1,
					limit: _this.limit,
					shop_id: this.shop_id
				}
				httpRequest.request(url, 'GET', data, false, false, true).then(res => {
					if (res.code == 1) {
						res.data.data.forEach(item => {
							let arr = item.images ? item.images.split(",") : []
							let arr2 = []
							arr.forEach(value => {
								arr2.push(this.imgUrl + value)
							})
							this.$set(item, "images_text", arr2)
							if (item.user_data) {
								item.user_data.avatar = this.imgUrl + item.user_data.avatar
							}
						})
						let resList = res.data;
						let dataList = _this.lists;
						if (isPage == true) {
							_this.lists.data = dataList.data.concat(resList.data);
						} else {
							this.lists = res.data
							_this.lists.data = resList.data;
						}
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			onReachBottom() {
				let _this = this;
				let list = null;
				if (this.tabActive == 0) {
					list = _this.list;
				}
				if (this.tabActive == 1) {
					list = _this.lists;
				}
				let page = _this.page;
				if (list.last_page <= page) {
					return false;
				}
				page++;
				_this.page = page;
				if (this.tabActive == 0) {
					_this.getGoodsList(true, page);
				}
				if (this.tabActive == 1) {
					_this.init(true, page);
				}
			},
			scancode() {
				uni.navigateTo({
					url: "/pages_index/saomajg?id=" + this.shop_id
				})
			},
			collectshop() { //收藏店鋪
				if (!httpRequest.checkIsLogin()) {
					uni.navigateTo({
						url: "/pages/login/login"
					})
					return false
				}
				this.http.request('/api/shop/addcollect', 'POST', {
					shop_id: this.shop_id
				}).then(res => {
					if (res.code == 1) {
						this.http.toast("操作成功")
						this.getInfo()
					} else {
						this.http.toast(res.msg)
					}
				})
			},
			getInfo() { //商家詳情
				let _this = this
				this.http.request('/api/shop/shop', 'POST', {
					shop_id: this.shop_id
				}).then(res => {
					if (res.code == 1) {
						let topimages_arr = []
						let inimages_arr = []
						let info = res.data
						if (info.is_yes == 0 || (info.is_yes == 1 && info.is_yes1 == 0)) {
							httpRequest.modal('請注意', "目前店家休息中，無法訂購商品可先預訂， 待營業立即為您處理 ", false, (resp) => {})
						}
						info.logoimage = this.imgUrl + info.logoimage
						info.topimages.split(",").forEach(item => {
							topimages_arr.push(this.imgUrl + item)
						})
						info.inimages.split(",").forEach(item => {
							inimages_arr.push(this.imgUrl + item)
						})
						this.$set(info, "topimages_arr", topimages_arr)
						this.$set(info, "inimages_arr", inimages_arr)
						this.shopInfo = info
						this.pageShow = true
						if (res.data.is_pj == 0) {
							this.tabList = [{
								name: "商品"
							}, {
								name: "評價"
							}, {
								name: "商家總覽"
							}, ]
						}
					} else if (res.code == 0) {
						this.http.toast(res.msg)
					} else {
						this.http.toast('系統處理中，請稍後再試');
					}
				})
			},
			sharemsg() {
				let that = this
				if (navigator.share) {
					navigator.share({
							title: that.shopInfo.shop_share_title,
							text: that.shopInfo.shop_share_title,
							url: window.location.href + '&invite_code=' + uni.getStorageSync(
								"invite_code"), // 當前頁面 URL
						})
						.then(() => {
							console.log('分享成功');
						})
						.catch(error => {
							console.error('分享失敗', error);
						});
				} else {
					this.http.toast("當前瀏覽器不支持分享")
				}
			},
			getGoodsList(isPage, page) { //商品列表
				let _this = this
				uni.showLoading({
					mask: true,
					title: "請稍後"
				})
				let shopclassify_id = this.shopclassify_id == "" ? [] : this.shopclassify_id.split(",")
				let category_id = shopclassify_id.length == 0 ? "" : shopclassify_id[shopclassify_id.length - 1] ==
					"" ?
					shopclassify_id[
						shopclassify_id.length - 2] : shopclassify_id[shopclassify_id.length - 1]
				this.http.request('/api/shop/listGoods', 'POST', {
					page: page || 1,
					limit: _this.limit,
					shop_id: this.shop_id,
					shopclassify_id: category_id,
					type: this.type, //排序類型默認0，1=銷量降，2-=銷量升，3=價格降 4=價格升
					name: this.name,
				}).then(res => {
					uni.hideLoading()
					if (res.code == 1) {
						res.data.data.forEach(item => {
							if (item.logoimage) {
								item.logoimage = this.imgUrl + item.logoimage
							}
						})
						let resList = res.data;
						let dataList = _this.list;
						if (isPage == true) {
							_this.list.data = dataList.data.concat(resList.data);
						} else {
							this.list = res.data
							_this.list.data = resList.data;
						}
					}
				})

			},
			change(e) {
				this.tabActive = e.index
				this.page = 1
				this.list = {
					data: []
				}
				if (this.tabActive == 0) {
					this.getGoodsList()
				}
				if (this.tabActive == 1) {
					this.init()
				}
			},
			goPhoneService() { //呼叫服務
				if (!httpRequest.checkIsLogin()) {
					uni.navigateTo({
						url: '/pages/login/login'
					})
					return false
				}
				uni.navigateTo({
					url: "/pages_index/phoneService?id=" + this.shop_id
				})
			},
			goReservation() { //預約排隊
				uni.navigateTo({
					url: "/pages_index/reservation?id=" + this.shop_id + "&issm=" + this.issm
				})
			},
			screenGoods() { //商品分類篩選
				this.current = 3
				this.type = 0
				uni.navigateTo({
					url: "/pages_index/classifyScreen?id=" + this.shop_id
				})
			},
			selectCom() { //商品綜合排序
				this.current = 0
				this.type = 0
				this.page = 1
				this.list = {
					data: []
				}
				this.getGoodsList()
			},
			selectSale() { //商品銷量排序
				this.current = 1
				this.type = this.type == 1 ? 2 : 1
				this.page = 1
				this.list = {
					data: []
				}
				this.getGoodsList()
			},
			selectPrice() { //商品價格排序
				this.current = 2
				this.type = this.type == 3 ? 4 : 3
				this.page = 1
				this.list = {
					data: []
				}
				this.getGoodsList()
			},
			selectCate(value) { //商品選擇分類
				this.shop_class.forEach(item => {
					item.isChecked = false
				})
				value.isChecked = true
				this.shopclassify_id = value.id + ","
				this.page = 1
				this.list = {
					data: []
				}
				this.getGoodsList()
			},
			selectabzh() { //綜合
				this.current = 0
				this.type = 0
			},
			selectab() { //銷量
				this.current = 1
				this.type = this.type == 0 ? 1 : this.type == 1 ? 2 : 1
				this.type == 0 ? this.sellnum = "" : this.sellnum = this.type
			},
			selectabprice() { //價格
				this.current = 2
				this.type = this.type != 3 ? 3 : 4
			},
			screen() { //距離
				this.current = 3
				this.type = 0
			},
			goGoodsInfo(id) { //商品詳情
				uni.navigateTo({
					url: "/pages_index/goodsInfo?id=" + id + "&issm=" + this.issm
				})
			},
			goBack() {
				uni.switchTab({
					url: "/pages/index/index"
				})
			},
			// goSearch() { //搜索
			// 	uni.navigateTo({
			// 		url: "./search"
			// 	})
			// },
			goTicketsType(type) { //電影票、演唱會、店家券
				let url = ""
				if (type == 0) {
					url = "./ticketInfo"
				} else if (type == 1) {
					url = "./vocalInfo"
				} else {
					url = "./shopTicket"
				}
				uni.navigateTo({
					url: url
				})
			},
			lingquan() { //領券
				if (!httpRequest.checkIsLogin()) {
					uni.navigateTo({
						url: "/pages/login/login"
					})
					return false
				}
				uni.navigateTo({
					url: "/pages_index/lingquan?id=" + this.shop_id
				})
			},
			goCart() { //購物車
				if (!httpRequest.checkIsLogin()) {
					uni.navigateTo({
						url: "/pages/login/login"
					})
					return false
				}
				uni.navigateTo({
					url: "./cart" + "?issm=" + this.issm
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		padding-bottom: 150rpx;
	}

	// 頭部
	.blackBox {
		width: 100%;
		height: 360rpx;
		background-color: rgba(0, 0, 0, 0.2);
		position: absolute;
		top: 0;
		left: 0;
		z-index: 99;
	}

	.btnBox {
		width: 100%;
		padding: 15rpx 30rpx;
		box-sizing: border-box;
		// position: absolute;
		// left: 0;
		// top: 50rpx;
		z-index: 100;
	}

	.searchBox {
		// height: 50rpx;
		background: #ffffff;
		border-radius: 65rpx 65rpx 65rpx 65rpx;
		border: 1rpx solid #333;
		padding: 8rpx;
		box-sizing: border-box;
	}

	// 店鋪
	.shopBox {
		background: #FFFFFF;
		// border-radius: 16rpx 16rpx 16rpx 16rpx;
		padding: 30rpx 30rpx 30rpx;

		.shopName {
			font-size: 40rpx;
			font-family: PingFang SC-Heavy, PingFang SC;
			font-weight: 800;
			color: #333333;
		}

		.call {
			width: 191rpx;
			height: 74rpx;
			line-height: 74rpx;
			text-align: center;
			background: rgba(255, 133, 5, 0.1);
			border-radius: 13rpx 13rpx 13rpx 13rpx;
			border: 2rpx solid #FF8505;
			font-size: 30rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #FF8505;
		}

		.reservation {
			width: 200rpx;
			height: 74rpx;
			line-height: 74rpx;
			text-align: center;
			background: #FF8505;
			border-radius: 13rpx 13rpx 13rpx 13rpx;
			border: 2rpx solid #FF8505;
			font-size: 30rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
		}

		.shopImg {
			width: 164rpx;
			min-width: 164rpx;
			height: 164rpx;
			background: #D9D9D9;
			border-radius: 12rpx 12rpx 12rpx 12rpx;
		}


	}

	.scan {
		width: 191rpx;
		height: 74rpx;
		line-height: 74rpx;
		text-align: center;
		background: rgba(255, 196, 0, 0.1);
		border-radius: 9rpx 9rpx 9rpx 9rpx;
		border: 1rpx solid #FFB800;
		font-size: 30rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #000000;
	}


	.chat {
		width: 161rpx;
		height: 74rpx;
		line-height: 74rpx;
		text-align: center;
		background: #FFC400;
		border-radius: 9rpx 9rpx 9rpx 9rpx;
		border: 1rpx solid #FFB800;
		font-size: 30rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #000000;
		box-sizing: border-box;
	}

	.chat2 {
		width: 161rpx;
		height: 74rpx;
		line-height: 74rpx;
		text-align: center;
		border-radius: 9rpx 9rpx 9rpx 9rpx;
		border: 1rpx solid #FF8505;
		font-size: 30rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		background: rgba(255, 92, 0, 0.1);
		color: #FF8505;
		box-sizing: border-box;
	}

	// 分類篩選
	.cateNoSelect {
		padding: 5rpx 20rpx;
		line-height: 53rpx;
		line-height: 53rpx;
		text-align: center;
		background: #EFEFEF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		border: 1rpx solid #EFEFEF;
		font-size: 24rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #333333;
	}

	.cateSelect {
		padding: 5rpx 20rpx;
		line-height: 53rpx;
		text-align: center;
		background: rgba(255, 92, 0, 0.1);
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		border: 1rpx solid #FF5C00;
		font-size: 24rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #FF5C00;
	}

	// 商品列表
	.goodsBox {
		width: 330rpx;
		border-radius: 11rpx 11rpx 0 0;

		.goodsImg {
			width: 330rpx;
			height: 330rpx;
			border-radius: 11rpx;
			overflow: hidden;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.price {
			font-size: 24rpx;
			font-family: DIN Next LT Pro-Medium, DIN Next LT Pro;
			font-weight: 500;
			color: #FF0000;
		}
	}

	.ticketImg {
		width: 164rpx;
		height: 228rpx;
		border-radius: 6rpx 6rpx 6rpx 6rpx;
		overflow: hidden;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.ticketPrice {
		font-size: 40rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #FF5C00;
	}

	// 評價
	.evalHead {
		width: 73rpx;
		height: 73rpx;
		border-radius: 50%;
	}

	.evalImg {
		width: 25%;
		border-radius: 20rpx;
		overflow: hidden;
		display: flex;
		justify-content: center;

		image {
			width: 152rpx;
			height: 152rpx;
		}
	}

	.shopInfoImg {
		width: 38rpx;
		height: 38rpx;
	}

	// 底部
	.footerBox {
		width: 100%;
		padding: 0 30rpx;
		box-sizing: border-box;
		position: fixed;
		left: 0;
		bottom: 40rpx;

		.footerPirce {
			width: 708rpx;
			height: 101rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(0, 0, 0, 0.05);
			border-radius: 53rpx 53rpx 53rpx 53rpx;
		}

		.cart {
			width: 40.5rpx;
			height: 42.58rpx;
			background-image: url("@/static/images/index/cart_num.png");
			background-size: 100% 100%;
			position: relative;
		}

		.num {
			width: 35rpx;
			height: 35rpx;
			line-height: 35rpx;
			text-align: center;
			background: #FF5C00;
			border-radius: 50%;
			position: absolute;
			right: -20rpx;
			top: -20rpx;
			font-size: 17rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
		}

		.line_r {
			width: 0;
			height: 42rpx;
			border-right: 2rpx dashed rgba(0, 0, 0, 1);
		}

		.totalPrice {
			font-size: 26rpx;
			font-family: DIN Next LT Pro-Medium;
			font-weight: 500;
			color: rgba(253, 70, 62, 1);
		}

		.settlement {
			width: 178rpx;
			min-width: 178rpx;
			max-width: 178rpx;
			height: 101rpx;
			line-height: 101rpx;
			text-align: center;
			background: #FFB800;
			border-radius: 0rpx 53rpx 53rpx 0rpx;
			font-size: 32rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #000000;
		}

		.settlementleft {
			width: 150rpx;
			height: 101rpx;
			line-height: 101rpx;
			text-align: center;
			background: #ff8505;
			border-radius: 53rpx 0 0rpx 53rpx;
			font-size: 32rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #fff;
		}
	}

	.shopPhone {
		width: 52rpx;
		min-width: 52rpx;
		height: 52rpx;
	}

	.kefuImg {
		width: 86rpx;
		min-width: 86rpx;
		height: 86rpx;
		position: fixed;
		right: 0;
		top: 80%;
	}

	.xiaodd {
		position: absolute;
		top: -5rpx;
		right: -5rpx;
	}
</style>